import 'package:ducafe_ui_core/ducafe_ui_core.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:get/get.dart';

import '../../common/index.dart';
import 'index.dart';
import 'widgets/index.dart';

class MyPlantPage extends GetView<MyPlantController> {
  const MyPlantPage({super.key});

  // 构建空状态视图
  Widget _buildEmptyState() {
    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          SizedBox(height: 130.h),
          // 添加植物图标
          Image.asset(
            AssetsImages.addPlant,
            width: 120.w,
            height: 120.h,
            fit: BoxFit.contain,
          ),
          // SizedBox(height: 15.h),
          // 标题文本
          Text(
            "No plants yet",
            style: TextStyle(
              fontSize: 24.sp,
              fontWeight: FontWeight.w700,
              color: const Color(0xFFCDFF5F),
            ),
          ),
          SizedBox(height: 10.h),
          // 说明文本
          Padding(
            padding: EdgeInsets.symmetric(horizontal: 40.w),
            child: Text(
              "Start your plant journey by adding your first green friend",
              textAlign: TextAlign.center,
              style: TextStyle(fontSize: 16.sp, color: Colors.white),
            ),
          ),
          Spacer(),
          SizedBox(height: 30.h),
        ],
      ),
    );
  }

  // 主视图
  Widget _build_view() {
    // 定义卡片背景颜色
    final List<Color> cardColors = [
      const Color(0xFFF2F2F2), // #F2F2F2
      const Color(0xFFCDFE64), // #CDFE64
      const Color(0xFFBFC4E5), // #BFC4E5
    ];

    return Column(
      children: [
        SizedBox(height: 45.h),
        Row(
          children: [
            SizedBox(width: 20.w),
            Text(
              "My Plant",
              style: TextStyle(
                fontSize: 24.sp,
                fontWeight: FontWeight.w900,
                color: const Color(0xFFCDFF5F),
              ),
            ),
            SizedBox(width: 4.w),
            Container(
              width: 60.w,
              height: 60.w,
              decoration: BoxDecoration(
                image: DecorationImage(
                  image: AssetImage(AssetsImages.myPlantBg),
                  fit: BoxFit.cover,
                ),
              ),
            ),

            const Spacer(),

            GestureDetector(
              onTap: () => controller.add_plant(),
              child: Container(
                height: 40.h,
                width: 40.w,
                padding: EdgeInsets.all(10.r),
                decoration: BoxDecoration(
                  color: Color(0xFFCDFF5F),
                  borderRadius: BorderRadius.circular(10.r),
                ),
                child: SvgPicture.asset(
                  AssetsImages.add,
                  width: 20.w,
                  height: 20.h,
                ),
              ),
            ),
            SizedBox(width: 24.w),
          ],
        ),
        SizedBox(height: 20.h),
        Expanded(
          child: Obx(() {
            final plants = controller.plants;

            if (plants.isEmpty) {
              return _buildEmptyState();
            }

            return ListView.builder(
              padding: EdgeInsets.symmetric(horizontal: 24.w),
              itemCount: plants.length,
              itemBuilder: (context, index) {
                // 根据索引获取颜色（循环使用三种颜色）
                final color = cardColors[index % cardColors.length];
                final plant = plants[index];

                return PlantCard(
                  plant: plant,
                  card_color: color,
                  onTap: () => controller.on_plant_tap(plant),
                );
              },
            );
          }),
        ),
      ],
    );
  }

  @override
  Widget build(BuildContext context) {
    return GetBuilder<MyPlantController>(
      init: MyPlantController(),
      id: "my_plant",
      builder: (_) {
        return Scaffold(
          body: Container(
            width: double.infinity,
            height: double.infinity,
            decoration: const BoxDecoration(
              image: DecorationImage(
                image: AssetImage(AssetsImages.bg),
                fit: BoxFit.cover,
              ),
            ),
            child: SafeArea(bottom: false, top: false, child: _build_view()),
          ),
        );
      },
    );
  }
}
